/* =============================================================================================
 * Layout for Kairos TX-Coffield Unit
 * File: kc.css     CSS page
 * 
 * Author: s.clark
 * Copyright: (c) 2015 Kairos TX-Coffield Unit
 * Created: Mar 25, 2015
 * Browsers tested on: FireFox, IE11
 */



/* General HTML body styling */

body {
    padding: 0; 
    margin: 0; 
/*    background: lightgrey; */
    text-align: left;
}
p {font-family: Arial; font-size: 12pt; text-align: left; margin-left: 15px; margin-right: 15px; }
ul {font-family: Arial; font-size: 12pt; text-align: left; margin-left: 15px; margin-right: 15px;
     list-style: disc; list-style-position: inside; }
ol {font-family: Arial; font-size: 12pt; text-align: left; margin-left: 15px; margin-right: 15px; 
    list-style: decimal; list-style-position: outside; }
span {font-family: Arial; font-size: 12pt; text-align: left;}
table, tr, td {font-family: Arial; font-size: 12pt;}
div {font-family: Arial; font-size: 12pt; text-align: left; display: block;}
h2, h3 {text-align: left; margin-left: 15px; font-size: 18pt;}            

.bold{font-weight: bold;}
.underline{text-decoration: underline;}
.strikeout{text-decoration: line-through;}
.Em1{font-size: 12pt;}
.Em2{font-size: 12pt;}
.Em3{font-size: 12pt;}
.imgCenter{display: block; margin: 0 auto;}
.clear {clear: both; display: block; overflow: hidden; visibility: hidden; width: 0px; height: 0px;}
.mobileParTopMarg1{}

/*  What are Viewport-Percentage Lengths?   
 * 		see  http://stackoverflow.com/questions/1575141/make-div-100-height-of-browser-window  
 * */
 
/* Our Container for the page */
#ourContainer{width: 980px; height: 100vh; margin: 0px auto 0px auto; display: block;}

.showBorder{border: 0px solid black;}

/* Heading Division */
header#Hdg{width: 100%; height: 60px; margin: 0px; padding: 0px; display: block; background: url('BlueFade1.png') repeat-x;}
#hdrImg1{width: 100%; height: 100%; padding-top: 2px;  }
#MnuDiv{float: left; width: 50px; display: none;  padding: 0px;}
#MenuImg {height: 50px; padding: 10%; border: 0px solid black;}
.icon-layer-1:before { content: "\e607"; }

/*   Menu & SectionBody Div  */
 #MainDiv{width: calc(100% - 50px); display: block; overflow-y: auto;  background-color: tan; padding-left: 25px; padding-right: 25px;} /* color set by Josh */

/* Footer Div */
#Footer{width: 100%; height: 5vh; background: url('BlueFade2.png') repeat-x;}
#Footer1, #Footer2, #Footer3, #Footer4, #Footer5{margin-top: 20px;}
#Footer1, #Footer2{float: left; font-size: 9pt;}
#Footer1{margin-left: 8px;}
#Footer2{margin-left: 40px;}
#Footer5{display: none; float: left; font-size: 9pt; margin-left: 60px;}
#Footer3, #Footer4{float: right; margin-top: 20px; margin-right: 12px; font-size: 9pt;}
a.ctact:link {color:red;}
a.ctact:visited {color:LightGray;} 






#kcAgent{margin-left: 10px;}	/* Used for JS detection of which css is added  */


/*  
 * 		Mobile stuff
 */
@media screen and (max-width: 980px){
	
	/* General adjustments */
	/* #ourContainer {margin: 0px; width: 100%;} */
	#MainDiv {font-size: 14pt;}
	
	#hdrImg1 {width: calc(100% - 80px); padding-top: 2px;} 
	
	#MnuDiv {display: block; height: 80%; }
	/*#mobileMenu2{display: block;}
	#MenuDiv{display: none; width: 100%;}*/
	
	#Footer2 {display: none;}
	#Footer3 {display: none;}
		
	#kcAgent{margin-left: 10px;}	/* Used for JS detection of which css is added  */
	.showBorder{border: 0px;}
}

@media screen and (max-width: 420px){
	/* #homeImg1{width: 80%;} */
	#Footer1 {display: none;}
}